<template>
    <div class="menageView">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>
                    <i class="el-icon-lx-cascades"></i> 审核列表
                </el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <!-- <div class="searchOperationView flex flex-align-c">
                <div class="searchOperationViewLi flex flex-align-c">
                    作品名
                    <el-input v-model="input" class="searchInput" placeholder="请输入作品名"></el-input>
                </div>
                <div class="searchOperationViewLi flex flex-align-c">
                    主播
                    <el-input v-model="input" class="searchInput" placeholder="请输入主播"></el-input>
                </div>
                <div class="searchOperationViewLi flex flex-align-c">
                    作者名字
                    <el-input v-model="input" class="searchInput" placeholder="请输入作者名字"></el-input>
                </div>
                <el-button type="primary" class="opentionButton" icon="el-icon-search">查询</el-button>
                <el-button icon="el-icon-refresh" class="opentionButton">重置</el-button>
                <el-button icon="el-icon-plus" class="opentionButton">新增</el-button>
            </div> -->

            <el-table class="tableView" :data="tableData" style="width: 100%">
                <el-table-column prop="id" label="序号" align="center" width="50" fixed="left"></el-table-column>
                <el-table-column prop="title" label="小说名称" width="180"></el-table-column>
                <el-table-column prop="categoryName" label="分类" width="180"></el-table-column>
                <el-table-column prop="bookType" label="书籍类型"></el-table-column>
                <el-table-column prop="speaker" label="主播/工作室" width="220" align="center"></el-table-column>
                <el-table-column prop="author" label="作者"></el-table-column>
                <el-table-column prop="newestChapter" label="章节更新信息" width="180"></el-table-column>
                <el-table-column prop="updateStatus" label="完结情况">
                    <template slot-scope="scope">
                        <el-tag
                            type="warning"
                            v-show="scope.row.updateStatus == 'update_status_serial'"
                        >连载中</el-tag>
                        <el-tag
                            type="warning"
                            v-show="scope.row.updateStatus != 'update_status_serial'"
                        >已完结</el-tag>
                    </template>
                </el-table-column>
                <el-table-column prop="auditStatus" label="审核情况">
                    <template slot-scope="scope">
                        <el-tag
                            type="warning"
                            v-show="scope.row.auditStatus == 'audit_status_wait'"
                        >待审核</el-tag>
                        <el-tag
                            type="success"
                            v-show="scope.row.auditStatus == 'audit_status_pass'"
                        >已通过</el-tag>
                        <el-tag
                            type="warning"
                            v-show="scope.row.auditStatus == 'audit_status_nopass'"
                        >未通过</el-tag>
                        <el-tag
                            type="warning"
                            v-show="scope.row.auditStatus == 'audit_status_draft'"
                        >草稿</el-tag>
                    </template>
                </el-table-column>
                <el-table-column label="操作" width="280" fixed="right">
                    <template slot-scope="scope">
                        <div class="operatioButton flex">
                            <el-button type="danger" @click="auditStatus(scope.row.id,'audit_status_nopass')">不通过</el-button>
                            <el-button type="success" @click="auditStatus(scope.row.id,'audit_status_pass')">通过</el-button>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                class="pageChangeView"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage4"
                :page-size="10"
                :total="totalPages"
            ></el-pagination>
        </div>
    </div>
</template>

<script>
import Qs from 'qs';

export default {
    data() {
        return {
            reviewes: [
                {
                    value: '选项1',
                    label: '1'
                },
                {
                    value: '选项2',
                    label: '2'
                }
            ],
            revieweValue: '',
            tableData: [],
            input: '',
            currentPage4: 1,
            totalPages: 0,
            param: { pageNum: 1, pageSize: 10 }
        };
    },
    created() {
        this.auditVoInfoList();
    },
    methods: {
        auditVoInfoList() {
            console.log(this.$request.auditVo);
            this.$request
                .getWaitAuditList(this.param)
                .then((res) => {
                    console.log(res);
                    this.tableData = res.data.content.content;
                    this.totalPages = res.data.content.totalElements;
                })
                .catch((err) => {
                    console.log(err);
                });
        },
        auditStatus(id, status) {
            console.log(id, status);
            this.$request
                .submitCommitAudit(Qs.stringify({ bookId: id, auditStatus: status }))
                .then((res) => {
                    console.log(res);
                    this.auditVoInfoList();
                })
                .catch((err) => {
                    console.log(err);
                });
        },
        goBack() {
            this.$router.go(-1);
        },
        handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
        },
        handleCurrentChange(val) {
            console.log(`当前页: ${val}`);
        }
    }
};
</script>


<style lang='scss'>
@import './index.scss';
</style>
